<template>
    <div class="dv1">{{obj.message}}</div>
    <div class="dv2">{{message1 }}</div>
</template>
<script setup>
    import {reactive,ref} from "vue";
    let obj=reactive({message:"不畏浮云遮望眼"});
    let message1=ref("普通数据");
    setTimeout(()=>{
        obj.message="欲穷千里目，更上一层楼";
        message1.value="新的响应式数据";
    },5000)
</script>
<style scoped>
  .dv1{
    color: yellow yellow;
    font-size: 30px;
    font-weight: bold;
  }
  .dv2{
     color: rgb(255, 0, 0);
    font-size: 30px;
    font-weight: bold;
  }
</style>